<template>
  <div>
    <!-- 发票信息 -->
    <div class="flex items-center justify-between mt-[30px] text-[16px]">
      <div class="flex items-center">
        <div class="w-[4px] h-[12px] bg-[#EF6800]"></div>
        <div class="ml-[10px] text-[#EF6800] text-[16px] font-bold">
          发票信息
        </div>
      </div>
    </div>
    <div class="mt-[30px]">
      <div>
        <el-form-item label="纳税人名称" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.invoice_name"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="纳税人识别号" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.invoice_no"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="税务登记号码" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.invoice_mobile"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="税务开户银行名称" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.invoice_bank"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="税务开户银行账号" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.invoice_bank_no"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="税务登记地址" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.invoice_address"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="姓名" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.name"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="手机号" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.mobile"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item label="收件详细地址" prop="name">
          <el-input
            :disabled="true"
            v-model="Info.address"
            style="width: 20vw"
            class="w-[318px]"
          ></el-input>
        </el-form-item>
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { defineProps, defineEmits, watchEffect, reactive } from "vue";
import { getBd } from "@/utils/api";
import { useRoute } from "vue-router";
interface infoType {
  invoice_name: string; //纳税人名称
  invoice_no: string; //纳税人识别号
  invoice_mobile: string; //税务登记号码
  invoice_bank: string; //税务开户银行名称
  invoice_bank_no: string; //税务开户银行账号
  invoice_address: string; //税务登记地址
  name: string; //收件人
  mobile: string;
  address: string; //收件详细地址
}
const props = defineProps({
  fpInfo: { type: Object },
});
const route = useRoute();
const Info = reactive<infoType>({
  invoice_name: "",
  invoice_no: "",
  invoice_mobile: "",
  invoice_bank: "",
  invoice_bank_no: "",
  invoice_address: "",
  name: "",
  mobile: "",
  address: "",
});
watchEffect(() => {
  if (props.fpInfo) {
    let key: keyof infoType;
    for (key in Info) {
      Info[key] = props.fpInfo[key];
    }
  }
});
</script>
<style scoped lang="scss"></style>
